<template>
	<div id="scoreManage">
		<div class="breadcrumb">
			<img src="../../../../static/img/outClass_icon_1.png" class="head_img">
			<span class="title">成绩管理</span>
		</div>
		<div class="search">
			<el-select v-model="semester" @change="getClasses()">
				<el-option v-for='item in semesters' :label='item.semesterName' :value='item.sid' :key="item.sid">
				</el-option>
			</el-select>
			<el-select v-model="teacher" @change="getClasses()" v-if="user.type !==3">
				<el-option label="全部老师" value='0'></el-option>
				<el-option v-for='item in teachers' :label='item.teacherName' :value='item.mid' :key="item.mid">
				</el-option>
			</el-select>
			<el-select v-model="course">
				<el-option label="全部课程" value='0'></el-option>
				<el-option v-for='item in courses' :label='item.name' :value='item.cid' :key="item.cid">
				</el-option>
			</el-select>
			<el-button class="sel_btn" type="primary" @click="search">筛选</el-button>
		</div>

		<div class="list">
			<div class="list_head">
				<el-input class="qizhiDate" type='text' placeholder="请输入学生手机号、学号或者姓名" icon="search" v-model="condition" @keyup.enter.native="search"
				 :on-icon-click="search"></el-input>
			</div>
			<el-table :data="list" @row-click="detail">
				<el-table-column prop="campusId" label="学号">
				</el-table-column>
				<el-table-column prop="name" label="姓名">
				</el-table-column>
				<el-table-column prop="gender" label="性别" width="80">
				</el-table-column>
				<el-table-column prop="teacherName" label="教师姓名">
				</el-table-column>
				<el-table-column prop="className" label="课程">
				</el-table-column>
				<el-table-column prop="isComplete" label="完成/学期目标">
					<template scope="scope">
						<span v-if="scope.row.isComplete ==1">已完成</span>
						<span v-if="scope.row.isComplete ==0">{{scope.row.validLength}}/{{scope.row.semesterGoal}}（公里）</span>
					</template>
				</el-table-column>
				<el-table-column prop="validRunTimes" label="运动有效次数">
				</el-table-column>
			</el-table>
			<div class="pagination">
				<el-pagination v-show="this.totalCount > 0" layout="prev, pager, next, jumper" :page-size="10" :current-page="currentPage"
				 :total="totalCount" @current-change="handleCurrentChange">
				</el-pagination>
			</div>
		</div>
	</div>
</template>

<script>
	import { mapState, mapActions } from "vuex";

	export default {
		data() {
			return {
				list: [],
				courses: [],
				teachers: [],
				semesters: [],
				semester: "",
				teacher: "0",
				totalCount: 0,
				course: this.$util.getUrlParam("cid") || "0",
				condition: this.$util.getUrlParam("condition") || "",
				currentPage: parseInt(this.$util.getUrlParam("pageNum")) || 1
			};
		},
		mounted() {
			if (this.user.type == 3) {
				this.teacher = this.user.mid;
				this.getSemesters();
			} else {
				this.getTeachers();
			}
		},
		computed: mapState({ user: state => state.user }),
		methods: {
			//学期列表
			getSemesters() {
				let url = this.$util.domain + "/campusadminapi/v1/tools/semesters";

				this.$http({
					url,
					method: "GET"
				}).then(response => {
					if (response.data.error == 10000) {
						let semesterList = response.data.data;
						let sid = this.$util.getUrlParam("sid");
						if (semesterList && semesterList.length > 0) {
							if (sid) {
								this.semester = sid == "0" ? "0" : sid * 1;
							} else {
								this.semester = semesterList[0].sid;
							}
							for (let i = 0; i < semesterList.length; i++) {
								this.semesters.push({
									sid: semesterList[i].sid,
									unids: semesterList[i].unids,
									endDate: semesterList[i].endDate,
									startDate: semesterList[i].startDate,
									semesterName: semesterList[i].semesterName
								});
							}
						}
						this.getTotalNum();
						this.getList();
					}
				});
			},
			//教师列表,
			getTeachers() {
				let url = this.$util.domain + "/campusadminapi/v1/tools/teachers";

				this.$http({
					url,
					method: "GET"
				}).then(response => {
					if (response.data.error == 10000) {
						let teacherList = response.data.data;
						if (teacherList && teacherList.length > 0) {
							let mid = this.$util.getUrlParam("mid");
							if (mid) {
								this.teacher = mid == "0" ? "0" : mid * 1;
							} else {
								this.teacher = teacherList[0].mid;
							}
							for (let i = 0; i < teacherList.length; i++) {
								this.teachers.push({
									mid: teacherList[i].mid,
									teacherName: teacherList[i].teacherName
								});
							}
						}
						this.getSemesters();
					}
				});
			},
			//课程列表
			getClasses() {
				this.courses = [];
				let url = this.$util.domain + "/campusadminapi/v1/tools/classes";

				if (this.teacher == "0" || this.semester == "0") {
					this.course = "0";
					return;
				}
				if (!this.teacher || !this.semester) {
					return;
				}

				this.$http({
					url,
					method: "GET",
					params: {
						mid: this.teacher,
						sid: this.semester
					}
				}).then(response => {
					if (response.data.error == 10000) {
						let coursesList = response.data.data;
						if (coursesList && coursesList.length > 0) {
							for (let i = 0; i < coursesList.length; i++) {
								this.courses.push({
									name: coursesList[i].name,
									cid: coursesList[i].id + ""
								});
							}
						}
					}
				});
			},
			search() {
				this.getTotalNum();
				this.getList();
			},
			//获取成绩列表
			getList() {
				let url = this.$util.domain + "/campusadminapi/v1/student/listwithscore";

				this.$http({
					url,
					method: "POST",
					body: JSON.stringify({
						pageSize: 10,
						cid: parseInt(this.course),
						mid: parseInt(this.teacher),
						sid: parseInt(this.semester),
						pageNum: parseInt(this.currentPage),
						condition: this.condition.trimLeft()
					})
				}).then(response => {
					if (response.data.error == 10000) {
						let scoreList = response.data.data;
						this.list = [];
						if (scoreList && scoreList.length > 0) {
							for (let i = 0; i < scoreList.length; i++) {
								let $index = i + 1,
									$campusId = scoreList[i].campusId,
									$name = scoreList[i].name,
									$gender = scoreList[i].gender,
									$teacherName = scoreList[i].teacherName,
									$className = scoreList[i].className,
									$isComplete = scoreList[i].isComplete,
									$semesterGoal = scoreList[i].semesterGoal / 1000,
									$validLength = scoreList[i].validLength / 1000,
									$validRunTimes = scoreList[i].validRunTimes + " （次）",
									$uid = scoreList[i].uid;
								if ($gender == 0) {
									$gender = "女";
								} else if ($gender == 1) {
									$gender = "男";
								}
								this.list.push({
									uid: $uid,
									name: $name,
									index: $index,
									gender: $gender,
									campusId: $campusId,
									className: $className,
									isComplete: $isComplete,
									teacherName: $teacherName,
									validLength: $validLength,
									semesterGoal: $semesterGoal,
									validRunTimes: $validRunTimes
								});
							}
						}
					}
				});
			},
			//获取数据条数
			getTotalNum() {
				let url = this.$util.domain + "/campusadminapi/v1/student/totalCount";

				this.$http({
					url,
					method: "POST",
					body: JSON.stringify({
						cid: parseInt(this.course),
						mid: parseInt(this.teacher),
						sid: parseInt(this.semester),
						condition: this.condition.trimLeft()
					})
				}).then(response => {
					if (response.data.error == 10000) {
						this.totalCount = response.data.data;
					}
				});
			},
			// 详情
			detail(row) {
				let startTime, endTime;
				for (let i = 0; i < this.semesters.length; i++) {
					if (this.semester == this.semesters[i].sid) {
						startTime = this.semesters[i].startDate;
						endTime = this.semesters[i].endDate;
					}
				}
				let params = {
					startTime,
					endTime,
					uid: row.uid,
					sid: this.semester,
					mid: this.teacher,
					cid: this.course,
					pageNum: this.currentPage,
					condition: encodeURI(this.condition.trimLeft())
				};
				this.$util.refreshTo("/#/scoreDetail", params);
			},
			//请求分页数据分页
			handleCurrentChange(val) {
				this.currentPage = val;
				this.getList();
			}
		}
	};
</script>

<style>
	#scoreManage {
		padding-top: 60px;
		height: calc(100% - 100px);
	}

	#scoreManage .el-table--enable-row-hover .el-table__body tr:hover>td {
		background-color: #f7fcff;
		cursor: pointer;
	}

	#scoreManage .import {
		position: absolute;
		right: 280px;
	}

	#scoreManage .export {
		position: absolute;
		right: 130px;
	}

	#scoreManage .add {
		position: absolute;
		right: 20px;
	}

	#scoreManage .search {
		margin: 20px 30px;
		background: #ffffff;
		border-radius: 2px;
		height: 60px;
		line-height: 60px;
		padding: 0 25px;
	}

	#scoreManage .sel_btn {
		position: absolute;
		right: 50px;
		margin-top: 12px;
	}

	#scoreManage .qizhiDate {
		width: 350px;
	}
</style>